<%@ page contentType="text/html; charset=UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<html>
<head>
<title>Logvan</title>
<link rel="shortcut icon" href="/escolares/html/images/icon/van.png">
<link href="/escolares/html/css/bootstrap.css" rel="stylesheet"
	type="text/css">
<link href="/escolares/html/css/DT_bootstrap.css" rel="stylesheet"
	type="text/css">
<link href="/escolares/html/css/bootstrap-datetimepicker.min.css"
	rel="stylesheet" type="text/css">

<script src="https://code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="/escolares/html/js/bootstrap.js"></script>
<script src="/escolares/html/js/jquery.dataTables.js"></script>
<script src="/escolares/html/js/DT_bootstrap.js"></script>
<script src="/escolares/html/js/bootstrap-datetimepicker.min.js"></script>
<script src="/escolares/html/js/jquery.Rut.min.js"></script>
<script src="/escolares/html/js/jquery.number.min.js"></script>
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
      <script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
    <![endif]-->
</head>
<script type="text/javascript">
	$(function() {
		$('#datetimepicker4').datetimepicker({
			format:"dd/MM/yyyy",
			pickTime : false
		});
	});
	
	$(document).ready(function(){
		enlazarCombos($("#sColegios"),$("#sCursos"),"/escolares/jsonColegioCurso");
	});
	
	function enlazarCombos(comboSource,comboDest,urlLoad){
		comboSource.bind("change",{},function(){
			var parentId=$(this).val();
			var data={parentId:parentId};
			comboDest.html("");
			comboDest.append("<option value=\"0\">--Todas--</option>");
			$.getJSON(urlLoad,data,
		            function(response, textStatus, jqXHR) {
		        		var childs = [];
			        	for(indice=0;indice<response.length;indice++){
			        		var child=response[indice];
			        		var $option=$("<option>"+child.label+"</option>");
			        		$option.attr("value",child.value); 
			        		comboDest.append($option);
						}	        		
		            }
		        );
		});
	}
</script>
<script type="text/javascript">
	$(document).ready(function() {
		$('#tAnualidad').number(true, 0,',', '.');
		$('#tMontoMensual').number(true, 0,',', '.');
		$('#tCantidadPagos').number(true, 0,',', '.');
		$('#tRut').Rut({
			format_on : 'change',
			on_error : function() {
				alert('Rut incorrecto');
			}
		});
		$('#tMontoMensual').blur(function() {
					if ($('#tMontoMensual').val().length > 0 && $('#tCantidadPagos').val() != "")
						$('#tAnualidad').val(parseFloat($('#tMontoMensual').val())* parseFloat($('#tCantidadPagos').val()));
					else
						$('#tAnualidad').val("");
	
				});
		$('#tCantidadPagos').blur(function() {
					if ($('#tMontoMensual').val() != ""	&& $('#tCantidadPagos').val() != "")
						$('#tAnualidad').val(parseFloat($('#tMontoMensual').val())* parseFloat($('#tCantidadPagos').val()));
					else
						$('#tAnualidad').val("");
		});
		$('#bSave').click(function() {
	
			if ($("#tRut").val() == "") {
				alert("Debe Ingresar el Rut del Alumno");
				$('#tRut').focus();
				return false;
			}
	
			if ($("#tNombres").val() == "") {
				alert("Debe Ingresar el Nombre del Alumno");
				$('#tNombres').focus();
				return false;
			}
			if ($("#tApellidos").val() == "") {
				alert("Debe Ingresar los Apellidos del Alumno");
				$('#tApellidos').focus();
				return false;
			}
			if ($("#tFechaNacimiento").val() == "") {
				alert("Debe Ingresar la Fecha de Nacimiento del Alumno");
				$('#tFechaNacimiento').focus();
				return false;
			}
			if ($("#tDireccion").val() == "") {
				alert("Debe Ingresar la Dirección del Alumno");
				$('#tDireccion').focus();
				return false;
			}
			if ($("#tDireccionEmergencia").val() == "") {
				alert("Debe Ingresar la Dirección de Emergencia del Alumno ");
				$('#tDireccionEmergencia').focus();
				return false;
			}
			if ($("#tTelefono").val() == "") {
				alert("Debe Ingresar la Telefono del Alumno");
				$('#tTelefono').focus();
				return false;
			}
			if ($("#tMontoMensual").val() == "" || $("#tMontoMensual").val()== 0 ){
				alert("Debe Ingresar el Valor Mensual del Costo del Servicio ");
				$('#tMontoMensual').focus();
				return false;
			}
			if ($("#tCantidadPagos").val() == "" || $("#tCantidadPagos").val()== 0 ){
				alert("Debe Ingresar la cantidad de pagos del Servicio ");
				$('#tCantidadPagos').focus();
				return false;
			}
			if ($("#tAnulaidad").val() == "" || $("#tAnulaidad").val()== 0 ){
				alert("Debe Ingresar el Valor Anual del Costo del Servicio ");
				$('#tAnulaidad').focus();
				return false;
			}
			if ($("#sFurgones").val() == -1) {
				alert("Debe Seleccionar un Furgon");
				$('#sFurgones').focus();
				return false;
			}
			if ($("#sColegios").val() == -1) {
				alert("Debe Seleccionar un Colegio");
				$('#sColegios').focus();
				return false;
			}
			if ($("#sCursos").val() == -1) {
				alert("Debe Seleccionar un Curso");
				$('#sCursos').focus();
				return false;
			}
		});
	});
</script>
<body style="padding-top: 0px">
	<div class="container" style="width: 390px; height: 500px">
		<!-- Main component for a primary marketing message or call to action -->
		<div class="well" style="width: 350px">
			<s:form id="formAlumno" cssClass="form-inline" role="form"
				action="saveAlumno" method="post" theme="simple" namespace="">
				<s:hidden name="existOrNew" value="0"></s:hidden>
				<s:hidden name="alumno.apoderadoId" value="%{apoderado.apoderadoId}"></s:hidden>
				<s:hidden name="alumno.usuarioId" value="%{usuario.usuarioId}"></s:hidden>
				<div class="control-group" style="margin-left: 50px">


					<div class="controls">
						<s:textfield cssClass="span3" id="tRut" placeholder="Rut"
							name="alumno.rut"></s:textfield>
					</div>
					<div class="controls">
						<s:textfield cssClass="span3" id="tNombres" placeholder="Nombre"
							name="alumno.nombres"></s:textfield>
					</div>
					<div class="controls">
						<s:textfield cssClass="span3" id="tApellidos"
							placeholder="Apellidos"  name="alumno.apellidos"></s:textfield>
					</div>
					<div class="controls">
						<div id="datetimepicker4" class="input-append">
							<s:textfield  type="text"
								id="tFechaNacimiento" name="fechaNacimiento"
								placeholder="Fecha de Nacimiento"></s:textfield>
							<span class="add-on"> <i data-time-icon="icon-time"
								data-date-icon="icon-calendar"> </i>
							</span>
						</div>
					</div>
					<div class="controls">
						<s:textfield cssClass="span3" id="tDireccion"
							placeholder="Direccion"  name="alumno.direccion"></s:textfield>
					</div>
					<div class="controls">
						<s:textfield cssClass="span3" id="tDireccionEmergencia"
							placeholder="Direccion Emergencia" 
							name="alumno.direccionEmergencia"></s:textfield>
					</div>
					<div class="controls">
						<s:textfield cssClass="span3" id="tTelefono"
							placeholder="Telefono" name="alumno.telefono"></s:textfield>
					</div>
					<div class="controls">
						<s:textfield cssClass="span3" id="tAlergias"
							placeholder="Alergias" name="alumno.alergias"></s:textfield>
					</div>
					<div class="controls">
						<s:textfield cssClass="span3" id="tObservacion"
							placeholder="Observaciones" name="alumno.observacion"></s:textfield>
					</div>
					<div class="controls">
							<s:textfield cssClass="span3" id="tSistemaSalud"
								placeholder="Ingrese Sistema de Salud"
								name="alumno.sistemaSalud" value="%{alumno.sistemaSalud}"></s:textfield>
						</div>
					<div class="input-group">
					<span class="input-append">$</span>
						<s:textfield cssClass="span2 form-control" id="tMontoMensual"  name="montoMensual"
							placeholder="Monto Mensual"></s:textfield>
					</div>
					<div class="controls">
						<s:textfield cssClass="span3" id="tCantidadPagos" name="cantidadPagos"
							placeholder="Cantidad de Pagos"></s:textfield>
					</div>
					<div class="input-group">
					 	<span class="input-group-addon">$</span>
						<s:textfield cssClass="span2" id="tAnualidad" class="form-control"
							placeholder="Anualidad" name="alumno.anualidad"></s:textfield>
					</div>
					<div class="controls">
						<s:select list="furgones" id="sFurgones" cssClass="span3"
							headerKey="-1" headerValue="Seleccione Furgon"
							listValue="patente" listKey="furgonId" name="alumno.furgonId"></s:select>
					</div>
					<div class="controls">
						<s:select list="colegios" id="sColegios" styleId="sColegios" cssClass="span3"
							headerKey="-1" headerValue="Seleccione Colegio"
							listValue="nombre" listKey="colegioId"></s:select>
					</div>
					<div class="controls">
						<s:select list="cursos" id="sCursos" styleId="sCursos" cssClass="span3"
							headerKey="-1" headerValue="Seleccione Curso" listValue="nombre"
							listKey="cursoId" name="alumno.cursoId"></s:select>
					</div>
					<div class="controls">
						<s:submit action="saveAlumno" id="bSave" key="label.save"
							cssStyle="margin-left:80px;margin-top:30px;"
							cssClass="btn btn-info" />
					</div>
				</div>

			</s:form>
		</div>
	</div>
</body>
</html>

